*{
    margin: 0;
    padding: 0;
}
a{
    text-decoration: none;
}
ul li{
    list-style: none;
}

header{
    width: 100%;
    height: 40px;
    background: #333333;
}

header div{
    width: 100%;
    height: 40px;
    display: flex;
    flex-direction: row;
}
header div>ul{
    display: flex;
    flex-direction: row;
    line-height: 40px;
    font-size: 12px;
}
header div .ul1{
    margin-left: 145px; 
}
header div .ul1 li{
    margin-right: 25px;
}
header div .ul1 li:nth-child(1){
    position: relative;
}
header div .ul1 li:nth-child(1) span{
    display: inline-block;
    width: 138px;
    height: 160px;
    border: 1px solid #eeeeee;
    position: absolute;
    top: 44px;
    left: -60px;
    padding-top: 4px;
    display: none;
    background: white;
    z-index: 9;
}
header div .ul1 li:nth-child(1) span img{
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}
header div .ul1 li:nth-child(1) span p{
    font-size: 12px;
    text-align: center;
    margin-top: 125px; 
}
header div .ul1 li:nth-child(1):hover a{
    color: #999999;
}
header div .ul1 li:nth-child(1):hover span{
    display: block;
}



header div .ul1 li:nth-child(2){
    position: relative;
}
header div .ul1 li:nth-child(2)>span{
    display: inline-block;
    width: 138px;
    height: 160px;
    border: 1px solid #eeeeee;
    position: absolute;
    top: 44px;
    left: -45px;
    display: none;
    background: white;
    z-index: 9;
}
header div .ul1 li:nth-child(2) span img{
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}
header div .ul1 li:nth-child(2) span p{
    font-size: 12px;
    text-align: center;
    margin-top: 125px; 
}
header div .ul1>li:nth-child(2):hover>a{
    color: #999999;
}
header div .ul1 li:nth-child(2):hover span{
    display: block;
}
header div .ul1 li a{
    color: white;
}
header div .ul2 li>a{
    color: white;
}
header div .ul2{
    margin-left: 610px;
}
header div .ul2 li:nth-child(1){
    color:#666666;
}
header div .ul2 li:nth-child(1) .ago:hover{
    color: #999999;
}
header div .ul2 li:nth-child(1) .aup:hover{
    color: #999999;
}
header div .ul2>li:nth-child(2){
    padding-left: 30px; 
}
header div .ul2 li:nth-child(2) span{
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(../images/cssjltu.png) -78px -173px;
    margin-right: 5px;
}
header div .ul2>li:nth-child(2)>a:hover{
    color: #999999; 
}
header div .ul2 li:nth-child(2) a:hover span{
    background: url(../images/cssjltu.png) -110px -173px;
}
header div .ul2>li:nth-child(3){
    padding-left: 30px;
}
header div .ul2 li:nth-child(3) span{
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(../images/cssjltu.png) -10px -198px;
    margin-right: 5px;
}
header div .ul2>li:nth-child(3)>a:hover{
    color: #999999; 
}
header div .ul2 li:nth-child(3) a:hover span{
    background: url(../images/cssjltu.png) -177px -81px;
}
header div .ul2 li:nth-child(4){
    padding-left: 30px; 
    position: relative;
}
header div .ul2 li:nth-child(4) ul{
    position: absolute;
    width: 215px;
    height: 152px;
    top: 44px;
    right: -10px;
    border: 1px solid #eeeeee;
    display: none;
    background: white;
    z-index: 9;
}
header div .ul2 li:nth-child(4)>ul>li{
    width: 180px;
    height: 44px;
    margin-left: 20px;
    line-height: 44px;
    border-bottom: 1px solid #eeeeee;
}
header div .ul2>li:nth-child(4)>ul>li a{
    color: #666666;
}

header div .ul2 li:nth-child(4)>ul>li .ared{
    color: red;
}
header div .ul2>li:nth-child(4)>a:hover{
    color: #999999;
}
header div .ul2>li:nth-child(4):hover ul{
    display: block;
}